<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <meta charset="UTF-8">
    <title>Style Switcher</title>
    <link rel="stylesheet" href="css/style-switcher.css">
</head>
<body>
<div id="switcher" class="switcher">
    <h3>Style Switcher</h3>
    <button id="switcher-default">Defautl</button>
    <button id="switcher-narrow">Narrow Column</button>
    <button id="switcher-large">Large Print</button>
</div>
<h1>A Christmas Carol</h1>
<h2>In Prose, Being a Ghost Story of Christmas</h2>
<p>by Charles Dickens</p>
<dl>
    <dd><strong>Preface</strong></dd>
    <dd>
        <p>
            I Have endeavoured in this Ghostly little book,
            to raise the Ghost of an Idea,
            which shall not put my readers out of humour with themselvers,
            with each other,
            with season, or with me.
            May it haunt their houses pleaseantly,
            and no one wish to lay it.
        </p>
        <p>Their faithful Friend and servant, </p>
        <p>C. D. </p>
        <p>December, 1843.</p>
    </dd>
    <dd><strong>Stave I: Marley's Ghost</strong></dd>
</dl>
<script src="../node_modules/jquery/dist/jquery.js"></script>
<script src="js/style-switcher.js"></script>
<script src="js/exercise-1.js"></script>
<script src="js/exercise-2.js"></script>
<script src="js/exercise-3.js"></script>
<script src="js/exercise-4.js"></script>
<script src="js/exercise-5.js"></script>
</body>
</html>